import React,{Component} from 'react';
import PropTypes from 'prop-types';

import './AnswerList.less';

import TestContext from "./test-context";


class AnswerList extends Component {


    static contextTypes = {
        setNavConfig: PropTypes.func
    };


    static childContextTypes = {
        text: PropTypes.string,
        list: PropTypes.string
    };

    getChildContext() {
        return {
            text: "局部",
            list:"列表"
        };
    }


    constructor(props,context){
        super(props,context);
        
        context.setNavConfig(this.navConfig);
    }


    get navConfig(){
        return {
            center:"我的奖励"
        };
    }

    render(){

        return (

            <div className="answer-list" >


        <ul className="coupon">
            <li>
                <div className="left">
                    <TestContext />
                <p className="date">2017/09/26 15:44</p>
                <p className="detail">
                    <span className="black">答对</span>
                    <sapn className="number">3</sapn>
                    <span className="black">题</span> &nbsp;
                    <span>获得</span>
                    <sapn className="price">88</sapn>
                    <span>元优惠券</span>
                </p>
                </div>
                     <div className="right">
                        <p>去使用</p>
                    </div>
            </li>

            <li>
                    <div className="left">
                    <p className="date">2017/09/26 15:44</p>
                    <p className="detail">
                        <span className="black">答对</span>
                        <sapn className="number">3</sapn>
                        <span className="black">题</span> &nbsp;
                        <span >获得</span>
                        <sapn className="price">88</sapn>
                        <span>元优惠券</span>
                    </p>
                    </div>
                         <div className="right">
                            <p>去使用</p>
                        </div>
                </li>

                <li className="vip">
                        <div className="left">
                        <p className="date">2017/09/26 15:44</p>
                        <p className="detail">
                            <span className="black">答对</span>
                            <sapn className="number">3</sapn>
                            <span className="black">题</span> &nbsp;
                            <span>获得</span>
                            <sapn className="price">88</sapn>
                            <span >元优惠券</span>
                        </p>
                        </div>
                             <div className="right">
                                <p>去使用</p>
                            </div>
                    </li>
        </ul>

     <div className="chance">
         剩余答题机会<span>3</span>次
     </div>

     <div className="share">
            <p>分享增加机会</p>
        </div>
    </div>

        );

    }



}

export default AnswerList;